﻿@{
    Layout = null;
}
@model dai_hoc_tuong_lai.Models.LoginModel
@{  AjaxOptions ajaxOpts = new AjaxOptions
    {
        HttpMethod = "post",
        OnComplete = "completedAjaxRequest"
    };
    
}
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Đăng nhập </title>
    <!-- 1140px Grid styles for IE -->
    <!--[if lte IE 9]><link rel="stylesheet" href="css/ie.css" type="text/css" media="screen" />
        <![endif]-->
    <!-- The 1140px Grid -->
    <link href="../../JsLibarany/LoginPage/1140.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="/JsLibarany/LoginPage/1140.css" type="text/css" media="screen">
    <link rel="stylesheet" href="/JsLibarany/LoginPage/styles.css" type="text/css" media="screen">
    <link rel="stylesheet" href="/JsLibarany/LoginPage/default.css" type="text/css" media="screen">
    <!--css3-mediaqueries-js - http://code.google.com/p/css3-mediaqueries-js/ - Enables media queries in some unsupported browsers-->
    @*<script type="text/javascript" src="/JsLibarany/LoginPage/css3-mediaqueries.js"></script>*@
    <!-- Fonts -->
    <link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Droid+Sans:regular,bold|PT+Sans+Narrow:regular,bold|Droid+Serif:iamp;v1"
        rel="stylesheet" type="text/css">
    <!-- Scripts -->
    <script src="/Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.24.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
    <script src="/Scripts/JSMakeDialog.js" type="text/javascript"></script>
    <!-- Forms Elemets -->
    @*<script type="text/javascript" src="/JsLibarany/LoginPage/jquery.uniform.min.js"></script>*@
    <link rel="stylesheet" href="/JsLibarany/LoginPage/uniform.default.css" type="text/css"
        media="screen">
    @* <script type="text/javascript" src="/JsLibarany/LoginPage/custom.js"></script>*@
    <style>
        body
        {
            overflow-x: hidden;
        }
    </style>
</head>
<body class="texture">
    <div class="container">
        <div class="row">
            <div class="panel-wrapper panel-login">
                <div class="panel">
                    <div class="title">
                        <h4>
                            User Login</h4>
                        <div class="option">
                            Sign up for free »</div>
                    </div>
                    <div class="content">
                        <!-- ## Panel Content  -->
                        <script type="text/javascript">

                            function completedAjaxRequest(obj) {

                                var returnObj = eval('(' + obj.responseText + ')');

                                if (returnObj.Status == "success") {
                                    if (returnObj.Message != null) {
                                        makeSuccessHighlight(returnObj.Message);
                                    }
                                    else if (returnObj.RedirectUrl != null) {
                                        window.location.href = returnObj.RedirectUrl;
                                    }
                                } else {
                                    makeErrorHighlight(returnObj.Message);
                                }

                                return false;
                            }

                            function makeErrorHighlight(messageStr) {
                                var $highlight = $("<div style='padding: 0.7em; margin-bottom:5px; width: inherit;'><p><span class='ui-icon ui-icon-alert' style='float: left; margin-right: .3em;'></span><strong>Alert: </strong>" + messageStr + "</p></div>");
                                $highlight.addClass("ui-state-highlight ui-corner-all");
                                $highlight.prependTo(".warning-area");
                                $highlight.delay(4000).fadeOut(500);
                            }

                            function makeSuccessHighlight(messageStr) {
                                var $highlight = $("<div style='padding: 0.7em; margin-bottom:5px; width: inherit;'><p><span class='ui-icon ui-icon-info' style='float: left; margin-right: .3em;'></span><strong>Success: </strong>" + messageStr + "</p></div>");
                                $highlight.addClass("ui-state-highlight ui-corner-all");
                                $highlight.prependTo(".warning-area");
                                $highlight.delay(4000).fadeOut(500);
                            }

                            $(document).ready(function () {
                                makeEventDialog("a.makeUpdate");
                            });
                        </script>
                        @using (Ajax.BeginForm("Login", "Account", null, ajaxOpts, new { enctype = "multipart/form-data" }))
                        {
                            @Html.HiddenFor(model => model.ReturnUrl)
                            <div class="warning-area">
                            </div>
                            <div>
                                @Html.TextBoxFor(model => model.name, new { @placeholder = "User Name" })
                            </div>
                            <div>
                                @Html.PasswordFor(model => model.pass, new { @placeholder = "Pass" })
                            </div>
                            <div>
                                <input type="submit" class="button-blue submit" value="Login" />
                            </div>
                        }
                        <!-- ## / Panel Content  -->
                    </div>
                </div>
                <div class="shadow">
                </div>
            </div>
            <div class="login-details">
                <p>
                    Quên mật khẩu? &nbsp;&nbsp;&nbsp;
                        <a href="/Account/ForgetPassword" class="makeUpdate" 
                        data-dialog-title="Quên mật khẩu" data-dialog-id="editemailsystem">Nhấp tại đây</a></p>
            </div>
        </div>
    </div>
</body>
</html>
